<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>部门管理</title>
<script type="text/javascript" src="js/jquery-easyui-1.5.4.2/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery-easyui-1.5.4.2/jquery.easyui.min.js"></script>
<script type="text/javascript" src="js/jquery-easyui-1.5.4.2/locale/easyui-lang-zh_CN.js"></script>
<link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.5.4.2/themes/icon.css"/>
<link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.5.4.2/themes/black/easyui.css"/>
<link rel="stylesheet" type="text/css" href="css/taojin/layout.css"> 
</head>
<body>
<script type="text/javascript">
	//添加按钮
	function deptButtons(value,row,index){
		var editDept="",deleteDept="";
		 editDept = "<a class='cell_button' onclick='editDept("+row.deptId+")' style='margin-left:10px;'>编辑</a>"
		 deleteDept = "<a class='cell_button' onclick = 'deleteDept("+row.deptId+")' style='margin-left:5px;'>删除</a>"
		 return editDept+deleteDept;
	}
	
	//编辑部门
	
	function editDept(deptId){
		$("#dept-dialog").dialog({title:'编辑部门',href2:'editDept',deptId:deptId});
		$("#dept-form").form('load','getDeptById?deptId='+deptId);
		$("#dept-dialog").dialog('open');;
	}
	
	//删除部门
	function deleteDept(deptId){
		$.messager.confirm('提示','确定要删除该部门吗?',function(data){
			if (data) {
				$.getJSON("deleteDept",{deptId:deptId},function(data){
					if (data==true) {
						$("#dept-dg").datagrid('reload');
					}else {
						$.messager.alert('提示', "删除失败!请检查部门员工是否为0");
					}
				});
			}
		})
	}
	
	//导入datagrid表格
	$(function(){
		$("#dept-dg").datagrid({
			url:'getDepts',
			method:'post',
			singleSelect:true,
			columns:[[
				{field:'deptId',title:'部门编号',width:1,align:'center'},
				{field:'deptName',title:'部门名称',width:1,align:'center'},
				{field:'deptEmps',title:'部门人数',width:1,align:'center'},
				{field:'deptDescribe',title:'部门简述',width:4,align:'center'},
				{field:'operate',title:'操作',width:3,formatter:deptButtons}]],
				onLoadSuccess:function(data){
					$(".cell_button").linkbutton({});
					$('#dept-dg').datagrid('fixRowHeight');
				},rowStyler:function(index,row){
					return 'height:32px';
				}
		});
			
		//添加部门
		$("#dept-add").linkbutton({
			onClick:function(){
				$("#dept-dialog").dialog({title:'添加部门',href2:'addDept'});
				$("#dept-form").form('clear');
				$("#dept-dialog").dialog('open');
			}
		});
		
		//刷新部门
		$("dept-refresh").linkbutton({
			onClick:function(){
				$("#dept-dg").datagrid('reload');
			}
		});
		
		
	})
</script >
	<div class="easyui-layout" id="dept-layout" data-options="fit:true,border:false">
		<div data-options="region:'center',border:false" style="overflow:hidden;">
			<table id="dept-dg" class="easyui-datagrid"
				data-options="fit:true,fitColumns:true,toolbar:'#dept-dg-toolbar',pagination:true,rownumbers:true,rownumberWidth:30,
				border:false,scrollbarSize :0">
			
			</table>
			<div id="dept-dg-toolbar" >
				<a id="dept-add" class="easyui-linkbutton" href="#" data-options=""	>添加部门</a>
				<a id="dept-refresh" class="easyui-linkbutton" href="#" data-options="">刷新</a>
			</div>
		</div>
		<div data-options="region:'south',border:false" style="height: 50px;"></div>
	</div>

	<div id="dept-dialog" class="easyui-dialog" title="添加部门"
		style="height: 500px; width: 400px;"
		data-options="
			resizable:true,modal:true,closed:true,buttons:[{
				text:'保存',
				iconCls:'icon-ok',
				handler:function(){
					$('#dept-form').form({
						url:$('#dept-dialog').dialog('options').href2,
						onSubmit:function(param){
							var value = $('#deptName').textbox('getValue');
							if(value == ''){
								$.messager.alert('警告','部门名称不可为空!!!');
								return false;
							}
						},
						success:function(data){
							if(data == 'true'){
								$('#dept-dg').datagrid('reload');
								$('#dept-dialog').dialog('close');
							}else{
								$.messager.alert('警告','添加失败!');
							}
				
						}
					}).submit();
				
				}
			},{
				text:'关闭',
				iconCls:'icon-cancel',
				handler:function(){
				$('#dept-dialog').dialog('close');
				}
			}]
		">
		<form id="dept-form" method="post">
			<div>
				<input  name="deptId" type="hidden">
			</div>
			<div style="margin-left: 10px; margin-top: 20px; font-size: 16px;">
				<input id="deptName" name="deptName" class="easyui-textbox" style="height: 30px; width: 300px;"
					data-options="label:'部门名称:',labelWidth:70">
			</div>
			<div style="margin-left: 10px; margin-top: 20px;">
				<input id="deptDescribe" name="deptDescribe" class="easyui-textbox" style="height: 100px; width: 300px;"
					data-options="label:'部门简述:',labelWidth:70,multiline:true">
			</div>
		</form>
	</div>

</body>
</html>